<html>
<head>
    <title> new document </title>
    <meta charset="utf-8"/>
    <meta name="generator" content="editplus">
    <meta name="author" content="">
    <meta name="keywords" content="">
    <script src="js/jquery-3.6.0.js"></script>
    <link href="https://fastly.jsdelivr.net/npm/@bootcss/v3.bootcss.com@1.0.35/dist/css/bootstrap.min.css"
          rel="stylesheet">
    <link rel="stylesheet" href="./bootstrap5.1.3/css/bootstrap.min.css">
    <meta name="description" content="">
    <script>
    function findObj(theObj, theDoc) {
        var p, i, foundObj;
        if (!theDoc) {
            theDoc = document;
        }

        if ((p = theObj.indexOf("?")) > 0 && parent.frames.length) {
            theDoc = parent.frames[theObj.substring(p + 1)].document;
            theObj = theObj.substring(0, p);
        }

        if (!(foundObj = theDoc[theObj]) && theDoc.all) {
            foundObj = theDoc.all[theObj];
        }

        for (i = 0; !foundObj && i < theDoc.forms.length; i++) {
            foundObj = theDoc.forms[i][theObj];
        }

        for (i = 0; !foundObj && theDoc.layers && i < theDoc.layers.length; i++) {
            foundObj = findObj(theObj, theDoc.layers[i].document);
        }

        if (!foundObj && document.getElementById) {
            foundObj = document.getElementById(theObj);
            return foundObj;
        }
    }
    //添加一个参与人填写行
    function AddSignRow() {
        //读取最后一行的行号，存放在txtTRLastIndex文本框中
        var txtTRLastIndex = findObj("txtTRLastIndex", document);
        var rowID = parseInt(txtTRLastIndex.value);
        var signFrame = findObj("SignFrame", document);
        //添加行
        var newTR = signFrame.insertRow(signFrame.rows.length);
        newTR.id = "SignItem" + rowID;
        //添加列:序号
        var newNameTD = newTR.insertCell(0);
        //添加列内容
        newNameTD.innerHTML = newTR.rowIndex.toString();
        //添加列:字段
        var newNameTD = newTR.insertCell(1);
        //添加列内容
        newNameTD.innerHTML = "<input class='form-control' style='margin-bottom: 2px; margin-top: 2px; height: 25px;' name='txtName" + rowID + "' id='txtName" + rowID + "' type='text' size='12' />";
         //添加列:类型
        var newTypeTD = newTR.insertCell(2);
        //添加列内容
        newTypeTD.innerHTML = "<input class='form-control' style='margin-bottom: 2px; margin-top: 2px; height: 25px;' name='txtEMail" + rowID + "' id='txtEmail" + rowID + "' type='text' size='20'/>";
         //添加列:枚举
        var newEnumTD = newTR.insertCell(3);
        //添加列内容
        newEnumTD.innerHTML = "<input class='form-control' value='无' style='margin-bottom: 2px; margin-top: 2px; height: 25px;' name='txtEMail" + rowID + "' id='txtEmail" + rowID + "' type='text' size='20' />";
         //添加列:默认值
        var newDefaultTD = newTR.insertCell(4);
        //添加列内容
        newDefaultTD.innerHTML = "<input class='form-control' style='margin-bottom: 2px; margin-top: 2px; height: 25px;' name='txtEMail" + rowID + "' id='txtEmail" + rowID + "' type='text' size='20' />";
        //添加列:必填
        var newRequiredTD = newTR.insertCell(5);
        //添加列内容
        newRequiredTD.innerHTML = "<input class='form-control' style='margin-bottom: 2px; margin-top: 2px; height: 25px;' name='txtEMail" + rowID + "' id='txtEmail" + rowID + "' type='text' size='20' />";
        //添加列:可编辑
        var newEditableTD = newTR.insertCell(6);
        //添加列内容
        newEditableTD.innerHTML = "<input class='form-control' style='margin-bottom: 2px; margin-top: 2px; height: 25px;' name='txtEMail" + rowID + "' id='txtEmail" + rowID + "' type='text' size='20' />";
        //添加列:max
        var newMaxTD = newTR.insertCell(7);
        //添加列内容
        newMaxTD.innerHTML = "<input class='form-control' style='margin-bottom: 2px; margin-top: 2px; height: 25px;' name='txtEMail" + rowID + "' id='txtEmail" + rowID + "' type='text' size='20' />";
        //添加列:max
        var newCharTypeTD = newTR.insertCell(8);
        //添加列内容
        newCharTypeTD.innerHTML = "<input class='form-control' style='margin-bottom: 2px; margin-top: 2px; height: 25px;' name='txtEMail" + rowID + "' id='txtEmail" + rowID + "' type='text' size='20' />";



        //添加列:删除按钮
        var newDeleteTD = newTR.insertCell(9);

        //添加列内容
        newDeleteTD.innerHTML = "<div  align='center' style='width:40px; font-size: 13px'><a href='javascript:;' onclick=\"DeleteSignRow('SignItem" + rowID + "')\">删除</a></div>";
        //将行号推进下一行
        txtTRLastIndex.value = (rowID + 1).toString();
    }

    //删除指定行
    function DeleteSignRow(rowid) {
        var signFrame = findObj("SignFrame", document);
        var signItem = findObj(rowid, document);

        //获取将要删除的行的Index
        var rowIndex = signItem.rowIndex;

        //删除指定Index的行
        signFrame.deleteRow(rowIndex);

        //重新排列序号，如果没有序号，这一步省略
        for (i = rowIndex; i < signFrame.rows.length; i++) {
            signFrame.rows[i].cells[0].innerHTML = i.toString();
        }
    }

    //清空列表
    function ClearAllSign() {
        if (confirm('确定要清空所有字段吗？')) {
            var signFrame = findObj("SignFrame", document);
            var rowscount = signFrame.rows.length;
            //循环删除行,从最后一行往前删除
            for (i = rowscount - 1; i > 0; i--) {
                signFrame.deleteRow(i);
            }
            //重置最后行号为1
            var txtTRLastIndex = findObj("txtTRLastIndex", document);
            txtTRLastIndex.value = "1";

//预添加一行
            AddSignRow();
        }
    }
    // 提交，生成用例
    $("#buttonsub").click(function () {
        var data=$("#new_row_form").serialize();
        console.log(data)
        $.ajax({
            url:'{:url("{% block generate_url %}/case_manage/new_page/generate_case/{% endblock %}")}', //实际使用请改成服务端真实接口
            data: data,
            type: "post",//方法类型
            success: function(res){
                    layer.alert(res.msg, {icon: 6},function () {
                        // 获得frame索引
                        var index = parent.layer.getFrameIndex(window.name);
                        //关闭当前frame
                        parent.layer.close(res.msg);
                        parent.location.reload(); //刷新父亲对象
                    });
            }
        })
    })

    </script>
</head>
<body>
<div>
    <form action="" method="post" id="new_row_form">
            <table width="764" border="1" cellpadding="2" cellspacing="1"
           id="SignFrame" class="table-primary">
        <tr id="trHeader" style="font-size: 10px">
            <td style="background: lightblue">序号</td>
            <td style="background: lightblue">字段名</td>
            <td style="background: lightblue">字段类型</td>
            <td style="background: lightblue">枚举值</td>
            <td style="background: lightblue">默认值</td>
            <td style="background: lightblue">必填</td>
            <td style="background: lightblue">编辑</td>
            <td style="background: lightblue">最大字符</td>
            <td style="background: lightblue">备注</td>
            <td align="center" style="background: lightblue"> </td>
        </tr>
    </table>
        <input type="submit" id="buttonsub" value="提交">
    </form>

</div>
<div>
    <input type="button" name="Submit" value="添加字段" onclick="AddSignRow()"/>
    <input type="button" name="Submit2" value="清空" onclick="ClearAllSign()"/>
    <input name='txtTRLastIndex' type='hidden' id='txtTRLastIndex' value="1"/>
</div>
</body>
</html>